<!DOCTYPE html>
<html>

	<head lang="en">
		<meta charset="UTF-8">
		<title>完善当当购物车页面</title>
		<link type="text/css" rel="stylesheet" href="css/cartStyle.css" />
	</head>

	<body>

		<div class="content">
			<div class="logo">
				<img src="images/dd_logo.jpg"><span>关闭</span>
			</div>
			<div class="cartList">
				<ul>
					<li>¥<input type="text" name="price" value="21.90"></li>
					<li><input type="button" name="minus" value="-"><input type="text" name="amount" value="1"><input type="button" name="plus" value="+"></li>
					<li id="price0">¥21.90</li>
					<li>
						<p>移入收藏</p>
						<p>删除</p>
					</li>
				</ul>
				<ul>
					<li>¥<input type="text" name="price" value="24.00"></li>
					<li><input type="button" name="minus" value="-"><input type="text" name="amount" value="1"><input type="button" name="plus" value="+"></li>
					<li id="price1">¥24.00</li>
					<li>
						<p>移入收藏</p>
						<p>删除</p>
					</li>
				</ul>
				<ol>
					<li id="totalPrice">&nbsp;</li>
					<li><span>结 算</span></li>
				</ol>
			</div>
		</div>
		<script>
			var plusbtns=document.getElementsByName("plus");
			var amounts=document.getElementsByName("amount");
			var prices=document.getElementsByName("price");
			var minusbtns=document.getElementsByName("minus");
			var zongjia=document.getElementById("totalPrice");
			function toltotalPrice(){
				tol=0;
				for(var k=0;k<plusbtns.length;k++){
					var price=document.getElementById("price"+k);
					tol=tol+parseFloat(price.innerHTML.substring(1));
				}
				zongjia.innerHTML="&yen"+toround(tol);
			}
			toltotalPrice();
			for(var i=0;i<plusbtns.length;i++){
				plusbtns[i].index=i;
				plusbtns[i].onclick=function(){
					var j=this.index;
					amounts[j].value=parseInt(amounts[j].value)+1;
					var p=document.getElementById("price"+j);
					p.innerHTML="&yen"+toround(amounts[j].value*prices[j].value);
					toltotalPrice();
				}
				
			}
			for(var i=0;i<minusbtns.length;i++){
				minusbtns[i].index=i;
				minusbtns[i].onclick=function(){
					var j=this.index;
					amounts[j].value=parseInt(amounts[j].value)-1;
					if(amounts[j].value>=1){
						var p=document.getElementById("price"+j);
					p.innerHTML="&yen"+toround(amounts[j].value*prices[j].value);
					}else{
						alert("亲已经不能在减了!");
					}
					toltotalPrice();
				}
			}
			function toround(d){
				d=Math.round(d*100)/100;
				if((d+"").indexOf(".")==-1){
					return d+".00";
				}else{
					return d+"0";
				}
			}
		</script>
	</body>

</html>